
<template>

  <el-row>
    <el-col :span="12">

        <el-button type="primary" @click=" thumbnailDialog=true;">修改封面图</el-button>

    </el-col>
  </el-row>

  <el-dialog v-model="thumbnailDialog" title="修改封面图" style="width: 700px;">
    <el-row>
      <el-col :span="24">
        <img :src="thumbnailTemp" alt="" style="width: 100%"/>

        <el-upload
            v-model:file-list="thumbnailTempList"
            action=""
            :http-request="uploadFileThumbnail"
            :on-remove="handleRemove"
            :limit="1"
        >
          <el-button type="primary">重新上传</el-button>
        </el-upload>
      </el-col>
    </el-row>
  </el-dialog>
</template>


<script setup>


import {ref} from "vue";

import request from "@/utils/request";

let thumbnailTempList =ref([])
const thumbnailTemp =ref('')
const thumbnailDialog =ref(false)

function uploadFileThumbnail(file){
  const formData = new FormData()
  formData.append('file',file.file)
  request({
    url: '/file/upload',
    method:'post',
    data: formData
  }).then(res => {
    thumbnailTempList.value=[]
    file.onSuccess(res.data)
    thumbnailTemp.value=res.data
  })

}

const handleRemove = (uploadFile, uploadFiles) => {


}

</script>

<style scoped>



</style>

